<!DOCTYPE html>
<html lang="en" class="no-js" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout" layout:decorator="admin/layout">
<head>
<title>会员管理</title>
<script th:inline="javascript">
	/*<![CDATA[*/
	$.validator.addMethod('typeAllowed', function(value, element) {
		var suffix = value.split('.').pop().toLowerCase();
		if (!(suffix.match(/jpg|jpeg|png|gif/i))) {
			return false;
		} else {
			return true;
		}
	}, '上传的图片类型只能是png,gif,jpg,jpeg');
	function uploadFile(e) {
		$('#imgFile').click();
	}

	function uploadFile2(e) {
		if ($(e).val() != null) {
			var filename = $(e).val().substr($(e).val().lastIndexOf('\\') + 1);
			if (!($(e).val().split('.').pop().toLowerCase()
					.match(/jpg|jpeg|png|gif/i))) {
				$('#file_upload_help').show();
				return false;
			} else {
				$('#file_upload_help').hide();
			}
			$('#file_upload_span').html(filename);
			$('#form_brand_image').submit();
		}
	}
	$().ready(function() {
						$('#iframe_brand_image')
								.load(
										function() {
											var data = $(
													window.frames['iframe_brand_image'].document.body)
													.html();
											if (data != null
													&& data != ''
													&& !data
															.match('You failed to upload')) {
												$('#brand_logo_display_div')
														.html(
																'<img style="width:100%;height:100%;" src="'
																		+ $
																				.parseJSON(data).url
																		+ '"></img>');
												$('#logo').attr("value",
														$.parseJSON(data).url);
											}
										});
					})
					
					
					
	$(document).ready(function(){

		 $("#saleForm").validate({
	         rules:{
	        	 name:{
	            	 required:true
	             },userName:{
	            	 required:true
	             },prizeDate:{
	            	 required:true
	             },prizeUrl:{
	            	 required:true
	             }
	              
	         },
	         messages:{
	             name:{
	                 required:"请输入名称"
	             },userName:{
	                 required:"请输入活动对象"
	             },prizeDate:{
	                 required:"请输入活动时间"
	             },prizeUrl:{
	            	 required:"请输入活动地址"
	             }
	             
	         }
	         
	      });
		 
	  });
			/*]]>*/
</script>
</head>
<body>
<div layout:fragment="content">
	<div class="row">
		<div class="col-md-12">
			<div class="btn-group pull-right">
				<a href="index.html" th:href="@{/admin/user/sale/index/}" id="sample_editable_1_new" class="btn green">返回<i class="fa fa-arrow-circle-o-left"></i></a>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="form">
				<form role="form" th:action="@{/admin/user/sale/save}" th:object="${sale}" id="saleForm" method="post" class="form-horizontal">
					<h4 class="form-section">活动信息</h4>
					<input type="hidden" th:field="*{id}" />
					<div class="form-body">
						<div class="form-group" th:class="${#fields.hasErrors('name')}? 'form-group has-error' : 'form-group'">
							<label class="control-label col-md-3">活动名称:<span class="required" aria-required="true">* </span></label>							
							<div class="col-md-4">
								<input type="text" class="form-control" placeholder="活动名称" th:field="*{name}"/>
							</div>
						</div>
						<div class="form-group" th:class="${#fields.hasErrors('userName')}? 'form-group has-error' : 'form-group'">
							<label class="control-label col-md-3">活动对象:<span class="required" aria-required="true">* </span></label>							
							<div class="col-md-4">
								<input type="text" class="form-control" placeholder="活动对象" th:field="*{userName}"/>
							</div>
						</div>
						<div class="form-group" th:classappend="${#fields.hasErrors('prizeDate')}? 'has-error'">
							<label class="control-label col-md-3">活动时间:<span class="required">* </span></label>							
							<div class="col-md-4">
								<input id="prize_time" type="text" class="form-control" placeholder="活动时间" th:field="*{prizeDate}"/>
								<span class="help-block" th:if="${#fields.hasErrors('prizeDate')}" th:errors="*{prizeDate}"></span>
							</div>
						</div>
						<div class="form-group">
								<label class="control-label col-md-3">图片上传：</label>
								<div class="col-md-7">
									<input type="text" id="logo" th:field="*{prizePic}" />
									<div class="form-control" style="padding: 0;">
										<span style="padding-left: 5px;" id="file_upload_span"
											name="file_upload_span">未选择文件</span><input type="button"
											class="btn blue pull-right" onclick="uploadFile(this)"
											value="浏览" />
									</div>
									<p class="help-block text-center"
										style="color: red; display: none;" id="file_upload_help">上传的图片类型只能是png,gif,jpg,jpeg</p>
								</div>
							</div>
						<div class="form-group" >
							<label class="control-label col-md-3">状态:<span class="required" aria-required="true">* </span></label>							
							<div class="col-md-4">
								<select th:field="*{status}">
									<option value="1">进行中</option>
									<option value="0">已结束</option>
								</select>
							</div>
						</div>
						<div class="form-group" th:class="${#fields.hasErrors('prizeUrl')}? 'form-group has-error' : 'form-group'">
							<label class="control-label col-md-3">活动页面URL:<span class="required" aria-required="true">* </span></label>							
							<div class="col-md-4">
								<input type="text" class="form-control" placeholder="活动页面URL" th:field="*{prizeUrl}"/>
							</div>
						</div>
						
					</div>
					<div class="form-actions fluid">
						<div class="col-md-offset-3 col-md-9">
							<button type="submit" class="btn blue" name="sub">提交</button>
						</div>
					</div>
				</form>		
			</div>
		</div>
		<div style="display: none;">
				<form target="iframe_brand_image" action="/upload/SALE"
					enctype="multipart/form-data" method="post" id="form_brand_image"
					name="form_brand_image">
					<input type="file" id="imgFile" onchange="uploadFile2(this)"
						name="imgFile" />
				</form>
			</div>
			<iframe style="display: none;" id="iframe_brand_image"
				name="iframe_brand_image" frameborder="0"></iframe>
	</div>
</div>	
</body>
</html>

 <script th:inline="javascript">
/*<![CDATA[*/
$("#prize_time").click(function(){
			WdatePicker({startDate:'%y-%M-01 00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:true,readOnly:true});
		}).focus(function () {
            WdatePicker({startDate:'%y-%M-01 00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:true,readOnly:true});
        });
/*]]>*/
</script>